<template>
	<view class="taocircle">
		<!-- 小程序顶部状态栏  兼容流海屏-->
		<!-- #ifdef MP -->
		<view :style="{ height: mpbarheight + 'px' }"></view>
		<!-- #endif -->
		<!-- #ifdef APP-PLUS -->
		<view class="status_bar"><view class="top_view"></view></view>
		<!-- #endif -->
		<view class="" style="background-color: #FFFFFF;">
			<view class="" style="width: 400rpx;margin: 0 auto;background-color: #F7F7F7;    border-radius: 100rpx;">
				<u-tabs-swiper
					ref="uTabs"
					class="utabs"
					:list="list"
					:is-scroll="false"
					:current="current"
					@change="tabsChange"
					:swiperWidth="750"
					:bar-height="62"
					:bar-width="180"
					:width="105"
					:gutter="0"
					active-color="rgb(0, 0, 0)"
					activebg-color="#ffdb28"
					:bold="true"
					bg-color="$lt-bg"
					:offset="[15, 45]"
					:isdot="true"
					:bar-style="barsty"
					:active-item-style="activesty"
				></u-tabs-swiper>
			</view>
		</view>
		<swiper class="swiper-box" :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish">
			<!-- 爆款 -->
			<swiper-item class="swiper-item">
				<scroll-view scroll-y style="height: 100%;width: 100%;" @scrolltolower="onreachBottom">
					<view class="scroll1">
						<view class="faddish" v-for="(item, index) in faddishList" :key="index">
							<view class="user_top u-flex u-col-center u-row-between">
								<view class="u-flex u-col-center">
									<u-avatar :src="item.img" :size="60"></u-avatar>
									<text class="user_name u-p-l-18 " style="color:#101010;">{{ item.user }}</text>
								</view>
								<view class="transmit u-flex u-col-center u-row-center" @click="sharefriends(item, 1)">
									<u-image src="/static/image/transmit.png" :width="32" :height="32"></u-image>
									<text style="color: white; font-size: 28rpx;padding-left: 10rpx;">{{ item.goods_count }}</text>
								</view>
							</view>
							<view class="u-m-b-12 u-line-1" style="font-weight: 600;">{{ item.goods_title }}</view>
							<view class="info u-line-2" style="font-size: 24rpx;color: #787882;">{{ item.copywriting }}</view>
							<view class="imgsbox u-m-t-36">
								<block v-for="(res, index2) in item.imgs" :key="index2">
									<u-image width="210rpx" height="210rpx" border-radius="14rpx" :src="res" style="margin-bottom: 14rpx;"></u-image>
								</block>
							</view>
							<view class="tips u-p-16">
								<u-image width="154rpx" height="154rpx" border-radius="14rpx" :src="item.imgs[0]" style="margin-bottom: 14rpx;"></u-image>
								<view class="tips_right">
									<view class="u-line-1 u-p-b-10">{{ item.goods_title }}</view>
									<view class="label u-flex u-row-between">
										<view class="oneprice u-m-l-28">
											<view class="" style="color: #EE0F1B;">￥{{ parseFloat(item.after_price) }}</view>
											<view class="">到手价</view>
										</view>
										<view class="oneprice">
											<view class="" style="color: #EE0F1B;">￥{{ parseFloat(item.after_price) * (parseFloat(item.commission) / 100) }}</view>
											<view class="">预估收益</view>
										</view>
										<u-image
											width="136rpx"
											height="136rpx"
											border-radius="14rpx"
											src="/static/image/gobuy.png"
											style="margin-top: 10rpx;"
											@click="doshare(item, 1)"
										></u-image>
									</view>
								</view>
							</view>
							<view class="btns">
								<!-- 	<u-button :custom-style="otherbtnsty">复制文案</u-button>
								<u-button :custom-style="otherbtnsty">复制评论</u-button>
								<u-button :custom-style="otherbtnsty">保存图片</u-button>
								<u-button :custom-style="forwardsty" @click="doshare(item)">一键转发</u-button> -->
								<view class="u-p-r-20 u-flex u-row-center u-col-center" style="border-right: 4rpx solid #BBBBBB;" @click="dosaveallimg(item.imgs, 1)">
									<text class="iconfont icon-download" style="font-size: 48rpx;"></text>
									<text class="u-p-l-10">保存素材</text>
								</view>
								<view class="u-p-r-20 u-flex u-row-center u-col-center" style="border-right: 4rpx solid #BBBBBB;" @click="docopy(item.copywriting)">
									<text class="iconfont icon-copyt" style="font-size: 48rpx;"></text>
									<text class="u-p-l-10">复制文案</text>
								</view>
								<view class="u-p-r-20 u-flex u-row-center u-col-center" @click="doshare(item, 2)">
									<text class="iconfont icon-copy" style="font-size: 48rpx;"></text>
									<text class="u-p-l-10">复制口令</text>
								</view>
							</view>
						</view>
						<u-loadmore :status="status1" :margin-top="40" :margin-bottom="120" bg-color="transparent" />
					</view>
				</scroll-view>
			</swiper-item>
			<!-- 素材 -->
			<swiper-item class="swiper-item">
				<scroll-view scroll-y style="height: 100%;width: 100%;" @scrolltolower="onreachBottom">
					<view class="scroll2">
						<view class="faddish" v-for="(item, index) in cdrList" :key="index">
							<view class="user_top u-flex u-col-center u-row-between">
								<view class="u-flex u-col-center">
									<u-avatar :src="item.img" :size="60"></u-avatar>
									<text class="user_name u-p-l-18 " style="color:#101010;">{{ item.user }}</text>
								</view>
								<view class="transmit u-flex u-col-center u-row-center" @click="sharefriends(item, 2)">
									<u-image src="/static/image/transmit.png" :width="32" :height="32"></u-image>
									<text style="color: white; font-size: 28rpx;padding-left: 10rpx;">{{ item.num }}</text>
								</view>
							</view>
							<view class="tips">{{ item.copywriting }}</view>
							<view class="imgs u-flex u-row-start u-flex-wrap">
								<block v-for="(res, index2) in item.imgs" :key="index2">
									<u-image width="274rpx" height="488rpx" :src="res" style="margin-right: 15rpx;"></u-image>
								</block>
							</view>
							<view class="btns">
								<!-- <u-button
									:custom-style="{
										width: '320rpx',
										height: '60rpx',
										border: 'none',
										fontSize: '28rpx',
										padding: '0'
									}"
									@click="dosave(item.pic)"
								>
									保存图片
								</u-button>
								<u-button
									:custom-style="{
										width: '320rpx',
										height: '60rpx',
										backgroundColor: '#FFDB28',
										fontSize: '28rpx',
										border: 'none',
										padding: '0',
										color: '#ffffff'
									}"
									@click="doshare(item)"
								>
									一键转发
								</u-button> -->
								<view class="u-p-r-20 u-flex u-row-center u-col-center" @click="dosaveallimg(item.imgs, 2)">
									<text class="iconfont icon-download" style="font-size: 48rpx;"></text>
									<text class="u-p-l-10">保存素材</text>
								</view>
								<!-- <u-line color="#BBBBBB" direction="col" length="48rpx" /> -->
								<view class="" style="height:48rpx;border-right: 4rpx solid #BBBBBB;"></view>
								<view class="u-p-r-20 u-flex u-row-center u-col-center" @click="docopy(item.copywriting)">
									<text class="iconfont icon-copyt" style="font-size: 48rpx;"></text>
									<text class="u-p-l-10">复制文案</text>
								</view>
							</view>
						</view>
						<u-loadmore :status="status2" :margin-top="40" :margin-bottom="120" bg-color="transparent" />
					</view>
				</scroll-view>
			</swiper-item>
		</swiper>
		<u-popup v-model="popshow" mode="bottom" border-radius="13">
			<view class="popbox">
				<view class="poptitle">分享给朋友</view>
				<view class="popbot">
					<view class="" style="text-align: center;" @click="dosharewx(1)">
						<u-icon name="weixin-circle-fill" color="#59C12C" size="100"></u-icon>
						<view class="">微信好友</view>
					</view>
					<view class="" style="text-align: center;" @click="dosharewx(2)">
						<u-icon name="moments-circel-fill" color="#59C12C" size="100"></u-icon>
						<view class="">微信朋友圈</view>
					</view>
					<view class="" style="text-align: center;" @click="dosharewx(3)">
						<u-icon name="photo-fill" color="#2979ff" size="100"></u-icon>
						<view class="">保存到相册</view>
					</view>
				</view>
			</view>
		</u-popup>
		<u-popup v-model="tipsshow" mode="center" border-radius="13" width="550" height="370">
			<view class="tipsbox">
				<view class="title">去朋友圈分享</view>
				<view class="main">
					<view class="line">
						<view class="dot"></view>
						分享文案已自动复制
					</view>
					<view class="line">
						<view class="dot"></view>
						图片已自动保存到手机相册
					</view>
				</view>
				<view class="openweixin" @click="opentips">打开微信</view>
			</view>
		</u-popup>
		<canvas canvas-id="qrcode" style="width: 354px;height: 354px;" class="canvas-hide" />
		<canvas canvas-id="myCanvas" style="width: 710rpx;height: 1086rpx;backgroundColor: #FFFFFF" class="canvas-hide"></canvas>
		<u-toast ref="uToast"></u-toast>
		<u-back-top :scroll-top="scrollTop" :top="600"></u-back-top>
	</view>
</template>

<script>
import uQRCode from '@/js_sdk/uqrcode/uqrcode.js';
import uniCopy from '@/js_sdk/xb-copy/uni-copy.js';
export default {
	name: 'haha',
	data() {
		return {
			page: 1,
			max_page: 1,
			page2: 1,
			max_page2: 1,
			scrollTop: 0,
			val: 1,
			popshow: false,
			tipsshow: false,
			status1: 'loadmore',
			status2: 'loadmore',
			mpbarheight: this.statusBarHeight,
			otherbtnsty: {
				width: '150rpx',
				height: '60rpx',
				// backgroundColor: '#FFDB28',
				border: 'none',
				fontSize: '28rpx',
				padding: '0'
				// marginRight: '16rpx'
			},
			forwardsty: {
				width: '180rpx',
				height: '60rpx',
				backgroundColor: '#FFDB28',
				fontSize: '28rpx',
				border: 'none',
				padding: '0',
				color: '#ffffff'
				// marginRight: '20rpx'
			},
			cdrList: [
				// {
				// 	copywriting: '商品文案',
				// 	create_at: '2020-09-05 11:14:02',
				// 	id: 2,
				// 	nickname: '测试',
				// 	num: 1,
				// 	pic: '//img.letuilm.com/2020/08/bcd6e82020082717400312420.jpeg,//img.letuilm.com/2020/08/bcd6e82020082717400312420.jpeg',
				// 	user_img: 'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1610542142,718703573&fm=26&gp=0.jpg'
				// }
			],
			faddishList: [
				// {
				// 	copywriting: "商品文案",
				// 	create_at: "2020-09-05 10:19:39",
				// 	end_time: 1599270786,
				// 		: 1,
				// 	goods_title: "测试短标题",
				// 	id: 1,
				// 	item_id: "123456789",
				// 	pic: "//img.letuilm.com/2020/08/bcd6e82020082717400312420.jpeg,//img.letuilm.com/2020/08/bcd6e82020082717400312420.jpeg",
				// 	start_time: 1599270786,
				// 	imgs:[]
				// }
			],
			activesty: {
				fontWeight: 600,
				fontSize: '36rpx'
			},
			barsty: {},
			tabs: [
				{
					name: '爆款'
				},
				{
					name: '素材'
				}
			],
			list: [
				{
					name: '推荐'
				},
				{
					name: '素材',
					count: 0
				}
			],
			current: 0, // tabs组件的current值，表示当前活动的tab选项
			swiperCurrent: 0, // swiper组件的current值，表示当前那个swiper-item是活动的
			item: {},
			baseurl: '',
			qrurl: '',
			oneurl: '',
			base64: '',
			createbase64: '',
			goodsstr: ''
		};
	},
	//实例创建完成后被立即调用
	created() {},
	onLoad(option) {
		// #ifdef APP-PLUS || H5
		var loginRes = this.checkLogin('/pages/index/index', '2');
		if (!loginRes) {
			return false;
		}
		// #endif
	},
	onPageScroll(e) {
		this.scrollTop = e.scrollTop;
	},
	onPullDownRefresh() {
		//监听下拉刷新动作的执行方法，每次手动下拉刷新都会执行一次
		this.getbaogoods(1);
		this.getsucaigoods(1);
		setTimeout(() => {
			this.$refs.uToast.show({
				title: '刷新成功!',
				type: 'success'
			});
			uni.stopPullDownRefresh(); //停止下拉刷新动画
		}, 1000);
	},
	//挂载开始之前被调用
	beforeMount() {},
	//初次渲染完成
	onReady() {
		this.getbaogoods(1);
		this.getsucaigoods(1);
	},
	//全局只触发一次
	onLaunch() {},
	//从后台进入前台
	onShow() {
		// console.log(this.$mp.page.route);
		uni.setStorageSync('routeurl', 'taocircle');
	},
	//前台进入后台
	onHide() {},
	methods: {
		uploadbase() {
			let that = this;
			// #ifdef H5
			this.$u.api
				.douploadbase({
					file: that.createbase64
				})
				.then(res => {
					// console.log(res);
					if (res.code == 200) {
						that.baseurl = '//' + res.data.url;
						// if (val == 'a') {
						// 	// console.log('baseurl', this.baseurl);
						this.item.imgs.push(this.baseurl);
						// 	this.dosaveallimg(this.item.imgs);
						// } else {
						// 	that.doshare(val);
						// }
					}
				})
				.catch(err => {
					console.log(err);
				});
			// #endif
			// #ifndef H5
			uni.uploadFile({
				url: 'https://app.letuilm.com//api/upload',
				filePath: that.createbase64,
				name: 'file',
				success: function(uploadFileRes) {
					that.baseurl = '//' + JSON.parse(uploadFileRes.data).data.url;
					// if (val == 'a') {
					this.item.imgs.push(this.baseurl);
					// 	this.dosaveallimg(this.item.imgs);
					// } else {
					// 	that.doshare(val);
					// }
				},
				fail: function(err) {
					console.log('err'.err);
				}
			});
			// #endif
		},
		makeimg() {
			let _this = this;
			let phoneWith = this.phoneWith;
			// let scale = (phoneWith * 0.9) / 940;
			let scale = 1;
			console.log('倍率', scale);

			uni.showLoading({
				mask: true,
				title: '生成中...'
			});
			// let oneurl = this.oneurl;
			let base64 = this.base64;
			_this.downloadImages(this.oneurl, function(res) {
				// console.log(res);
				let oneurl = res;
				_this.drawPost(
					'myCanvas',
					356 * scale,
					543 * scale,
					[
						{
							type: 'image',
							url: oneurl,
							x: 0,
							y: 0,
							width: 356 * scale,
							height: 376 * scale,
							isCircle: false
						},
						{
							type: 'image',
							url: '/static/image/couponbg.png',
							x: 0,
							y: 0,
							width: 356 * scale,
							height: 543 * scale,
							isCircle: false
						},
						{
							type: 'text',
							text: '券后价',
							textAlign: 'left',
							lineAlign: 'TOP',
							x: 290 * scale,
							y: 340 * scale,
							color: 'white',
							size: 16,
							bold: true
						},
						{
							type: 'text',
							text: '￥',
							textAlign: 'left',
							lineAlign: 'TOP',
							x: 286 * scale,
							y: 360 * scale,
							color: 'white',
							size: 13,
							bold: true
						},
						{
							type: 'text',
							text: _this.item.after_price,
							textAlign: 'left',
							lineAlign: 'TOP',
							x: 300 * scale,
							y: 360 * scale,
							color: 'white',
							size: 18,
							bold: true
						},
						{
							type: 'text',
							text: '￥',
							textAlign: 'left',
							lineAlign: 'TOP',
							x: 5 * scale,
							y: 430 * scale,
							color: 'red',
							size: 14,
							bold: true
						},
						{
							type: 'text',
							text: _this.item.after_price,
							textAlign: 'left',
							lineAlign: 'TOP',
							x: 20 * scale,
							y: 430 * scale,
							color: 'red',
							size: 24,
							bold: true
						},
						// {
						// 	type: 'text',
						// 	text: '￥' + _this.someitem.someitem.reserve_price,
						// 	textAlign: 'left',
						// 	lineAlign: 'TOP',
						// 	x: 80 * scale,
						// 	y: 430 * scale,
						// 	color: '#6A6A6A',
						// 	size: 14,
						// 	bold: true
						// },
						// {
						// 	type: 'line',
						// 	width: 45,
						// 	x: 80 * scale,
						// 	y: 425 * scale,
						// 	color: '#6A6A6A'
						// },
						{
							type: 'text',
							text: _this.item.goods_title,
							textAlign: 'left',
							lineAlign: 'TOP',
							x: 13 * scale,
							y: 460 * scale,
							color: '#6A6A6A',
							size: 14,
							bold: true
						},
						{
							type: 'image',
							url: base64,
							x: 250,
							y: 415,
							width: 80 * scale,
							height: 80 * scale,
							isCircle: false
						}
					],
					data => {
						// console.log('---1', data);
						// if (_this.someitem.someitem.coupon_amount == '') {
						// 	base64ToPath(data)
						// 		.then(path => {
						// 			console.log('path', path);
						// 		})
						// 		.catch(error => {
						// 			console.error('error', error);
						// 		});
						// }
					}
				);
			});
		},
		// canvas绘画封装
		drawPost: function(id, width, height, options, callback) {
			const ctx = uni.createCanvasContext(id);
			let that = this;
			// console.log('ctx', ctx);
			for (let i = 0; i < options.length; i++) {
				let setting = options[i];
				if (setting.type == 'image') {
					if (setting.isCircle) {
						let x = setting.x + setting.width / 2;
						let y = setting.y + setting.height / 2;
						let r = setting.height / 2;
						ctx.save();
						ctx.beginPath();
						ctx.arc(x, y, r, 0, 2 * Math.PI);
						ctx.clip();
						ctx.drawImage(setting.url, setting.x, setting.y, setting.width, setting.height);
						ctx.restore();
					} else {
						ctx.drawImage(setting.url, setting.x, setting.y, setting.width, setting.height);
					}
				} else if (setting.type == 'text') {
					let text = setting.text;
					ctx.setFontSize(setting.size);
					ctx.setFillStyle(setting.color);
					if (text.length > 15 && text.length <= 30) {
						let s_text = text.slice(0, 15);
						let e_text = text.slice(15);
						ctx.fillText(s_text, setting.x, setting.y);
						ctx.fillText(e_text, setting.x, setting.y + 23);
					} else if (text.length > 30) {
						let s_text = text.slice(0, 15);
						let t_text = text.slice(16, 30);
						let e_text = text.slice(30, 45);
						ctx.fillText(s_text, setting.x, setting.y);
						ctx.fillText(t_text, setting.x, setting.y + 23);
						ctx.fillText(e_text, setting.x, setting.y + 45);
					} else if (text.length > 45) {
						let s_text = text.slice(0, 15);
						let t_text = text.slice(16, 30);
						let e_text = text.slice(30, 41) + '...';
						ctx.fillText(s_text, setting.x, setting.y);
						ctx.fillText(t_text, setting.x, setting.y + 23);
						ctx.fillText(e_text, setting.x, setting.y + 45);
					} else {
						ctx.fillText(setting.text, setting.x, setting.y);
					}
				} else if (setting.type == 'line') {
					ctx.setFillStyle(setting.color);
					ctx.setStrokeStyle(setting.color);
					ctx.moveTo(setting.x, setting.y);
					ctx.lineTo(setting.x + setting.width, setting.y);
					ctx.stroke();
				}
			}
			ctx.draw(true, function(e) {
				// console.log('e', e);
				uni.hideLoading();
				setTimeout(() => {
					uni.canvasToTempFilePath({
						x: 0,
						y: 0,
						width: width,
						height: height,
						quality: 1,
						canvasId: id,
						success: function(respon) {
							uni.hideLoading();
							// console.log('生成成功!');
							console.log('生成成功!', respon.tempFilePath);
							that.createbase64 = respon.tempFilePath;
							that.uploadbase();
							callback(respon.tempFilePath);
						},
						fail: function(res) {
							console.log('fail', res);
							uni.hideLoading();
							uni.showToast({
								title: '生成失败',
								icon: 'none'
							});
						}
					});
				}, 200);
			});
		},
		// 缓存本地
		downloadImages: function(url, callback) {
			uni.downloadFile({
				url: url,
				success: res => {
					// console.log('downloadFile', res);
					if (res.statusCode === 200) {
						callback(res.tempFilePath);
					}
				},
				fail: res => {
					uni.hideLoading();
					app.errornet('生成失败');
				}
			});
		},
		async make() {
			// 回调方式
			uQRCode.make({
				canvasId: 'qrcode',
				componentInstance: this,
				text: this.qrurl,
				size: 354,
				margin: 10,
				backgroundColor: '#ffffff',
				foregroundColor: '#000000',
				fileType: 'jpg',
				correctLevel: uQRCode.errorCorrectLevel.H,
				success: res => {
					console.log(res);
					this.base64 = res;
					// this.imglist[0].name=res
					this.makeimg();
				}
			});
		},
		dosharewx(val) {
			var _that = this;
			if (val === 1) {
				uni.share({
					provider: 'weixin',
					scene: 'WXSceneSession',
					type: 2,
					imageUrl: this.val == 1 ? this.baseurl : this.item.imgs[0],
					success: function(res) {
						console.log('success:' + JSON.stringify(res));
						if (_that.val === 1) {
							_that.doforward(this.item.id);
						} else {
							_that.doforward2(this.item.id);
						}
					},
					fail: function(err) {
						console.log('fail:' + JSON.stringify(err));
					}
				});
			}
			if (val === 2) {
				if (this.val === 1) {
					this.docopy(this.goodsstr);
					this.dosaveallimg(this.item.imgs, 1);
					this.tipsshow = true;
				} else {
					this.docopy(this.item.copywriting);
					this.dosaveallimg(this.item.imgs, 2);
					this.tipsshow = true;
				}
			}
			if (val === 3) {
				if (this.val === 1) {
					this.dosaveallimg(this.item.imgs, 1);
				} else {
					this.dosaveallimg(this.item.imgs, 2);
				}
			}
		},
		sharefriends(item, val) {
			this.popshow = true;
			this.val = val;
			this.item = item;
			if (val === 1) {
				this.doshare(item, 3);
			}
		},
		opentips() {
			this.tipsshow = false;
			// #ifdef APP-PLUS
			if (plus.runtime.isApplicationExist({ pname: 'com.tencent.mm', action: 'weixin://' })) {
				console.log('微信应用已安装');
				plus.runtime.openURL('weixin://');
				if (this.val === 1) {
					this.doforward(this.item.id);
				} else {
					this.doforward2(this.item.id);
				}
			} else {
				console.log('微信应用未安装');
				uni.showModal({
					content: '本机未检测到微信客户端，请先安装微信进行分享',
					success: function(res) {}
				});
			}
			// #endif
		},
		tbkjump(url) {
			// 淘宝的商品链接，换成需要访问的地址
			// let url = 'https://detail.tmall.com/item.htm?id=616607750344';
			let openUrl = url;
			// 因为 url 一般是从其它地方获取的，所以这里要将 http 和 https 删去
			// 也可以直接输入 https:// 之后的内容，则不需要此步判断，直接调用 plus.runtime.openURL
			if (url.substr(0, 5) === 'https') {
				openUrl = `taobao://${url.substr(8)}`;
			} else if (url.substr(0, 4) === 'http') {
				openUrl = `taobao://${url.substr(7)}`;
			}
			console.log('跳转' + openUrl);
			plus.runtime.openURL(openUrl, function(res) {
				uni.showModal({
					content: '本机未检测到对应客户端，是否打开浏览器访问页面？',
					success: function(res) {
						if (res.confirm) {
							plus.runtime.openURL(url);
						}
					}
				});
			});
		},
		docopy(str) {
			uniCopy({
				content: str,
				success: res => {
					// this.urlshow = true;
					uni.showToast({
						title: res,
						icon: 'none'
					});
				},
				error: e => {
					uni.showToast({
						title: e,
						icon: 'none',
						duration: 3000
					});
				}
			});
		},
		dosaveallimg(imgs, val) {
			// console.log(imgs)
			if (val === 1) {
				for (let i in imgs) {
					let str = 'http:' + imgs[i];
					this.dosave(str);
				}
			} else {
				for (let x in imgs) {
					this.dosave(imgs[x]);
				}
			}
		},
		// 保存图片
		dosave(downimg) {
			console.log(downimg);
			let that = this;
			// #ifdef  MP
			uni.downloadFile({
				url: downimg,
				success: res => {
					if (res.statusCode === 200) {
						// console.log('app', res.tempFilePath);
						uni.saveImageToPhotosAlbum({
							filePath: res.tempFilePath,
							success: res => {
								that.$refs.uToast.show({
									title: '保存成功',
									type: 'success'
								});
							},
							fail: err => {
								that.$refs.uToast.show({
									title: '保存失败',
									type: 'error'
								});
							}
						});
					}
				},
				fail: res => {
					uni.hideLoading();
					app.errornet('生成失败');
				}
			});
			// #endif

			// #ifdef APP-PLUS
			uni.getImageInfo({
				src: downimg,
				success(image) {
					// console.log(image.path);
					uni.saveImageToPhotosAlbum({
						filePath: image.path,
						success: () => {
							that.$refs.uToast.show({
								title: '保存成功',
								type: 'success'
							});
						}
					});
				}
			});

			// #endif

			// #ifdef H5
			var canvas = document.createElement('canvas');
			var img = document.createElement('img');
			img.onload = function(e) {
				canvas.width = img.width;
				canvas.height = img.height;
				var context = canvas.getContext('2d');
				context.drawImage(img, 0, 0, img.width, img.height);
				canvas.getContext('2d').drawImage(img, 0, 0, img.width, img.height);
				canvas.toBlob(blob => {
					let link = document.createElement('a');
					link.href = window.URL.createObjectURL(blob);
					link.download = '';
					link.click();
					that.$refs.uToast.show({
						title: '保存成功',
						type: 'success'
					});
				}, 'image/jpeg');
			};
			img.setAttribute('crossOrigin', 'Anonymous');
			img.src = downimg;
			// #endif
		},

		// 转发
		doforward(id) {
			this.$u.api
				.doforward({
					id: id
				})
				.then(res => {
					// console.log(res);
					if (res.code == 200) {
						this.$refs.uToast.show({
							title: '转发成功',
							type: 'success'
						});
					}
				})
				.catch(err => {
					console.log(err);
				});
		},
		// 转发 素材
		doforward2(id) {
			this.$u.api
				.doforward2({
					id: id
				})
				.then(res => {
					// console.log(res);
					if (res.code == 200) {
						this.$refs.uToast.show({
							title: '转发成功',
							type: 'success'
						});
					}
				})
				.catch(err => {
					console.log(err);
				});
		},
		getsucaigoods(page) {
			this.$u.api
				.getsucaigoods({
					page: page,
					pagesize: 10
					// sort:1,
					// desc:1
				})
				.then(res => {
					console.log('素材', res);
					if (res.code == 200) {
						this.max_page2 = res.data.max_page;
						if (uni.getStorageSync('oldmaterial').goods_title !== res.data.data[0].goods_title) {
							this.list[1].count = 1;
						}
						uni.setStorageSync('oldmaterial', res.data.data[0]);
						if (page == 1) {
							this.cdrList = res.data.data;
						} else {
							this.cdrList.push(...res.data.data);
						}
						for (let i in this.cdrList) {
							let arr = [];
							arr = this.cdrList[i].pic.split(',');
							this.cdrList[i].imgs = arr;
							// console.log(arr);
						}
					}
				})
				.catch(err => {
					console.log(err);
				});
		},
		getbaogoods(page) {
			this.$u.api
				.getbaogoods({
					page: page,
					pagesize: 10
					// sort:1,
					// desc:1
				})
				.then(res => {
					console.log('推荐', res);
					if (res.code == 200) {
						this.max_page = res.data.max_page;
						if (page == 1) {
							this.faddishList = res.data.data;
						} else {
							this.faddishList.push(...res.data.data);
						}
						for (let i in this.faddishList) {
							let arr = [];
							arr = this.faddishList[i].pic.split(',');
							this.faddishList[i].imgs = arr;
							// console.log(arr);
						}
					}
				})
				.catch(err => {
					console.log(err);
				});
		},
		doshare(item, num) {
			this.$u.api
				.makeshare({
					item_id: item.item_id
				})
				.then(res => {
					console.log('转链', res);
					if (res.data.shortLinkInfo.couponUrl) {
						this.qrurl = res.data.shortLinkInfo.couponUrl;
					} else {
						this.qrurl = res.data.shortLinkInfo.url;
					}
					this.oneurl = res.data.sharePictInfos[0].url;
					this.make();
					let str = item.goods_title + '\n';
					// str += `【原价】` + item.reserve_price + '\n';
					str += `【券后价】` + item.after_price + '\n';
					str += `-----------------` + '\n';
					if (res.data.taoTokenInfo.tokenContent) {
						str += res.data.taoTokenInfo.tokenContent + `去【淘宝】下单`;
					} else {
						str += res.data.taoTokenInfo.couponTokenContent + `去【淘宝】下单`;
					}
					this.goodsstr = str;
					if (num === 1) {
						this.tbkjump(this.qrurl);
					}
					if (num === 2) {
						this.docopy(str);
					}
				})
				.catch(err => {
					console.log(err);
				});

			// this.doforward(id);
		},
		// tabs通知swiper切换
		tabsChange(index) {
			this.swiperCurrent = index;
			this.list[1].count = 0;
			// console.log(index);
		},
		// swiper-item左右移动，通知tabs的滑块跟随移动
		transition(e) {
			let dx = e.detail.dx;
			this.$refs.uTabs.setDx(dx);
		},
		// 由于swiper的内部机制问题，快速切换swiper不会触发dx的连续变化，需要在结束时重置状态
		// swiper滑动结束，分别设置tabs和swiper的状态
		animationfinish(e) {
			let current = e.detail.current;
			this.$refs.uTabs.setFinishCurrent(current);
			this.list[1].count = 0;
			this.swiperCurrent = current;
			this.current = current;
			// console.log('current--', current);
			// if (current == 0) {
			// 	this.getactivitylist();
			// 	this.getactivityinfo();
			// }
			// else if (current == 1) {
			// 	// this.getexaminegoods()
			// } else {
			// 	this.getadoptgoods()
			// }
		},
		// scroll-view到底部加载更多
		onreachBottom() {
			console.log('触底1', this.swiperCurrent);
			if (this.swiperCurrent === 0) {
				console.log('0');
				this.status1 = 'loading';
				this.page = ++this.page;
				if (this.max_page < this.page || this.max_page == this.page) {
					this.status1 = 'nomore';
					return false;
				}
				this.getbaogoods(parseInt(this.page));
			} else {
				console.log('1');
				this.status2 = 'loading';
				this.page2 = ++this.page;
				if (this.max_page2 < this.page2 || this.max_page2 == this.page2) {
					this.status2 = 'nomore';
					return false;
				}
				this.getsucaigoods(parseInt(this.page));
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.taocircle {
	display: flex;
	flex-direction: column;
	height: calc(100vh - var(--window-top));
	// height: calc(100vh - 50px);
	width: 100%;
	background-color: $lt-bg;
	.utabs::v-deep {
		.u-scroll-bar {
			bottom: 8rpx;
		}
	}
	.swiper-box {
		// height: calc(100vh - 100rpx);
		flex: 1;
		margin-top: 20rpx;
		.scroll1 {
			.faddish {
				width: 718rpx;
				// height: 572rpx;
				background-color: #ffffff;
				// padding: 22rpx;
				margin: 0 auto;
				padding: 20rpx;
				border-radius: 16rpx;
				margin-bottom: 24rpx;
				.user_top {
					.transmit {
						width: 174rpx;
						height: 48rpx;
						background-color: #fad111;
						border-radius: 50rpx;
					}
				}
				.imgsbox {
					display: flex;
					justify-content: space-between;
					align-items: center;
					flex-wrap: wrap;
				}
			}
			.tips {
				font-size: 28rpx;
				color: #101010;
				display: flex;
				justify-content: space-between;
				align-items: center;
				background-color: #f7f7f7;
				.tips_right {
					width: 440rpx;
					.label {
						width: 440rpx;
						height: 102rpx;
						border-color: rgb(223, 223, 223);
						border-width: 2rpx;
						border-style: solid;
						border-radius: 24rpx;
						font-size: 28rpx;
						text-align: center;
					}
				}
			}
			.btns {
				display: flex;
				justify-content: space-around;
				align-items: center;
				margin-top: 20rpx;
			}
		}
		.scroll2 {
			.faddish {
				width: 718rpx;
				// height: 846rpx;
				background-color: #ffffff;
				// padding: 22rpx;
				margin: 0 auto;
				padding: 20rpx;
				border-radius: 16rpx;
				margin-bottom: 24rpx;
				.user_top {
					.transmit {
						width: 174rpx;
						height: 48rpx;
						background-color: #fad111;
						border-radius: 50rpx;
					}
				}
				.tips {
					font-size: 24rpx;
					color: #787882;
					line-height: 50rpx;
				}
				.imgs {
					margin-bottom: 20rpx;
				}

				.btns {
					display: flex;
					justify-content: space-around;
					align-items: center;
				}
			}
		}
	}
	.popbox {
		.poptitle {
			width: 100%;
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			font-size: 32rpx;
			border-bottom: 2rpx solid #e2e7ef;
		}
		.popbot {
			display: flex;
			justify-content: space-around;
			align-items: center;
			padding: 20rpx 0;
		}
	}
	.tipsbox {
		.title {
			margin: 40rpx auto;
			font-size: 36rpx;
			text-align: center;
		}
		.main {
			width: 480rpx;
			margin: 20rpx auto;
			.line {
				display: flex;
				justify-content: flex-start;
				align-items: center;
				font-size: 32rpx;
				margin: 15rpx 0;
				.dot {
					width: 15rpx;
					height: 15rpx;
					border-radius: 100rpx;
					background-color: #fc3949;
					margin-right: 15rpx;
				}
			}
		}
		.openweixin {
			width: 300rpx;
			height: 65rpx;
			line-height: 65rpx;
			text-align: center;
			border-radius: 30rpx;
			font-size: 36rpx;
			background-color: #fc3949;
			color: white;
			margin: 0 auto;
			margin-top: 40rpx;
		}
	}
	.canvas-hide {
		/* 1 */
		position: fixed;
		right: 100vw;
		bottom: 100vh;
		/* 2 */
		z-index: -9999;
		/* 3 */
		opacity: 0;
	}
}
/* #ifdef H5 */
.taocircle {
	height: calc(100vh - 50px);
	.swiper-box {
		height: calc(100vh - 50px);
	}
}
/* #endif */
</style>
